<!DOCTYPE html>
<html>
	<head lang="en">
		<meta charset="utf-8">
		<title>非诚勿扰</title>
		<link rel="stylesheet" href="css/style.css" />
	</head>
	
	<body>
		<div class="main">
			<div class="left">
				<img src="images/pic.gif" />
				<br /><br />
				<img src="images/col.gif" alt="收藏" />
			</div>
			<div class="right">
				<dl>
					<dt>非缘勿扰</dt>
					<dd><span id="star">主演：</span>苏有朋/秦岚/傅艺伟等</dd>
					<dd><span id="director">导演：</span><span title="导演">赖水清</span></dd>
					<dd><span id="label">标签：</span><span>苏有朋</span>国产电视剧<span>2013</span>连续剧</dd>
					<dd><span id="drama">剧情：</span>当代都市，大年女刘林、杨阳都在寻找自己的如意郎君，
					刘林偶遇陆氏房地产总裁路西诺，两人成了欢喜冤家，遭到暗恋西诺的丁娟的嫉恨...</dd>
				</dl>
				<img src="images/btn.gif" />
			</div>
		</div>
		<script type="text/javascript" src="js/jquery-1.12.4.js" ></script>
		<script>
			$(document).ready(function(){
			    $('dt').click(function(){
			        $('dd span[id]').css({"color":"#FF0099", "font-weight":"bold"});
			    });
			
			    $("#director").click(function(){
			        $("dd span[title]").css("font-weight","bold");
			    });
			
			
			    $('#label').click(function(){
			        $("#label~span").css({"background-color":"#E0F8EA","color":"#10A14B","padding":"2px 8px"});
			    });
			
			    $("img[alt]").click(function(){
			        alert("您已收藏成功！");
			    });
			});
		</script>
	</body>
</html>
